<script setup lang="ts">
import type { HouseDetailsPage } from '/@/types/home'

// 定义 props 接收数据
defineProps<{
  hotList: HouseDetailsPage[]
  indulgenceList: HouseDetailsPage[]
}>()
</script>

<template>
  <!-- 推荐专区 -->
  <view class="panel hot">
    <view class="item">
      <view class="title">
        <text class="title-text">特惠房间</text>
        <text class="title-desc">最超值的选择</text>
      </view>
      <navigator
        hover-class="none"
        :url="`/pages/contract/contractDetail?contractId=${item.contractId}`"
        class="cards"
        v-for="item in indulgenceList"
        :key="item.contractId"
      >
        <image class="image" mode="aspectFit" :src="item.image[0]"></image>
      
      </navigator>
    </view>

    <view class="item">
      <view class="title">
        <text class="title-text">爆款推荐</text>
        <text class="title-desc">最受欢迎</text>
      </view>
      <navigator
        hover-class="none"
        :url="`/pages/contract/contractDetail?contractId=${item.contractId}`"
        class="cards"
        v-for="item in hotList"
        :key="item.contractId"
      >
        <image class="image" mode="aspectFit" :src="item.image[0]"></image>
     
      </navigator>
    </view>

    <!-- <view class="item">
      <view class="title">
        <text class="title-text">精选房源</text>
        <text class="title-desc">精心优化</text>
      </view>
      <navigator hover-class="none" class="cards">
        <image class="image" mode="aspectFit" src="@/static/images/fang-5.png"></image>
        <image class="image" mode="aspectFit" src="@/static/images/fang-6.png"></image>
      </navigator>
    </view>

    <view class="item">
      <view class="title">
        <text class="title-text">一屋超值</text>
        <text class="title-desc">生活加分项</text>
      </view>
      <navigator hover-class="none" class="cards">
        <image class="image" mode="aspectFit" src="@/static/images/fang-7.png"></image>
        <image class="image" mode="aspectFit" src="@/static/images/fang-8.png"></image>
      </navigator>
    </view> -->
  </view>
</template>

<style lang="scss">

@import '../styles/hot.scss';



</style>
